<template lang="html">
  <div class="app bot-page">
    <top-header />
    <div class="w1200 overhide bot-link">
      <div class="left fl">
        <ul>
          <li v-for='(item,index) in links' :class="{active : item.isA}" @click='isAct(index)'>
            <i class="el-icon-caret-right"></i>{{item.name}}
          </li>
        </ul>
      </div>
      <div class="right fr">
        <div class="banner"><img src="../../assets/images/bot-intro-banner.jpg" alt=""></div>
        <div class="content">
          <work-intro v-if='links[0].isTrue' />
          <policy v-if='links[1].isTrue'/>
          <legal v-if='links[2].isTrue' />
          <call-us v-if='links[3].isTrue' />
          <join v-if='links[4].isTrue' />
        </div>
      </div>
    </div>
    <bot-footer2 class="po-bot" />
  </div>
</template>

<script>
import topHeader from '../header/header.vue'
import botFooter2 from '../footer/footer2.vue'
import workIntro from '../botLink/workIntro.vue'
import callUs from '../botLink/callUs.vue'
import policy from '../botLink/policy.vue'
import legal from '../botLink/legal.vue'
import join from '../botLink/join.vue'
export default {
  data(){
    return{
      links:[
        {isA:1,name:'工场简介',isTrue:true},
        {isA:0,name:'隐私政策',isTrue:false},
        {isA:0,name:'法律说明',isTrue:false},
        {isA:0,name:'联系我们',isTrue:false},
        {isA:0,name:'空间入驻',isTrue:false}
      ]
    }
  },
  methods:{
    isAct:function(index){
      for(let a of this.links){
      a.isA=0,a.isTrue=false
      }
      this.links[index].isA=1;
      this.links[index].isTrue=true
    },
    linkName:function(){
      let show=this.$route.params.id;
      ((show) => {
        for(let b of this.links){
          b.isTrue=false;
          b.isA=0
        }
        this.links[show].isTrue=true;
        this.links[show].isA=1
      })(show)
    }
  },
  created(){
    this.linkName();
  },
  components:{
    topHeader,botFooter2,workIntro,
    callUs,policy,legal,join
  }
}
</script>

<style lang="less">
@import "botLink.less";
</style>
